<template>
  <div
    class="navbar-wrapper"
    style="--theme-color: #105cfb; --themeColor: #105cfb"
  >
    <div class="nav-main__wrapper" style="background: rgb(255, 255, 255)">
      <div class="navbar-main">
        <!-- url('https://wechatapppro-1252524126.file.myqcloud.com/appngipqyj28209/image/b_u_62108464e63ba_tKMw7v26/l3tw11mw0fha.jpg') -->
        <div class="navbar-logo-common" :style="backgroundStyle_logo" />
        <!---->
        <div class="navbar-list">
          <div
            class="navbar-left nav-maxwidth"
            style="--max-width-style: 706px"
          >
            <div>
              <div class="nav-item know-nav">
                <a
                  href="/page/2947536?navIndex=0"
                  class=""
                  style="color: rgb(102, 102, 102); font-size: 14px"
                >
                  首页
                </a>
                <!---->
              </div>
            </div>
          </div>
          <div
            class="navbar-right"
            style="font-size: 14px; color: rgb(102, 102, 102)"
          >
            <!---->
            <div class="theme-customize-font no-login">
              <span class="func">登录</span>
            </div>
            <div class="icon-wrapper" style="font-size: 14px">
              <div>我的已购</div>
            </div>
            <div
              class="icon-wrapper leaning-icon opretor"
              style="
                --line-after-style: rgba(102, 102, 102, 1);
                font-size: 14px;
              "
            >
              <div>学习记录</div>
            </div>
            <div
              class="search-wrapper opretor"
              style="
                --line-after-style: rgba(102, 102, 102, 1);
                color: rgb(102, 102, 102);
              "
            >
              <i
                class="iconfont icon-hd_search"
                style="font-size: 16px; color: rgb(102, 102, 102)"
              />
              <div style="font-size: 14px">
                搜索
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      backgroundStyle_logo: {
        backgroundImage: 'url(/components/navbar/logo.jpg)',
        backgroundPosition: 'center center',
        backgroundSize: 'contain',
        backgroundRepeat: 'no-repeat'
      }
    }
  }
}
</script>

<style lang="scss" scoped>
$max-width-style: 706px;
$line-after-style: rgba(102, 102, 102, 1);

.navbar-wrapper {
  width: 100%;
  background: #fff;
  height: 72px;
}

.navbar-wrapper > .nav-main__wrapper {
  width: 100%;
  height: 72px;
  background: #fff;
  z-index: 999;
  left: 0;
  top: 0;
}

@import '~/static/sass/navbar_sass/navbar-main';
</style>
